<template>
  <view class="page_root" data-page-name="人效分析" data-page-identification="c_b81x00ro3o">
    <!-- UNI_APP_EXEGESIS_START NAVIGATION_TEMPLATE UNI_APP_EXEGESIS_END -->
    <!-- begin vid_9hrpm9gcyt 自定义模板_2nlk3222kv -->
    <view class="custom-tabs">
      <view class="custom-tab" :class="{ active: state.current === 0 }" @click="tabChange(0)">
        {{ tabList[0].name }}
        <span v-if="state.current === 0" class="custom-tab-underline"></span>
      </view>
      <view class="border-middle"></view>
      <view class="custom-tab" :class="{ active: state.current === 1 }" @click="tabChange(1)">
        {{ tabList[1].name }}
        <span v-if="state.current === 1" class="custom-tab-underline"></span>
      </view>
    </view>
    <view class="main-left" v-if="state.tabFlag">
      <view class="bgc-img"></view>
      <view class="work-hour">
        <view class="work-title-top">员工上月投入工时</view>
        <view class="work-bottom">
          <view class="bottom-left">上月：<span class="work-num">{{ state.staffHour }}</span> <span
              class="work-unit">人天</span>
          </view>
          <view class="bottom-left">同比：<span class="work-num">{{ state.staffHourDif < 0 ? -state.staffHourDif :
            state.staffHourDif }}</span>
                <span class="work-unit-black">人天</span> <span class="arrow-red" v-if="state.staffHourDif < 0"></span><span
                  v-else class="arrow-green"></span></view>
        </view>
      </view>
      <view class="work-hour">
        <view class="work-title-top">员工上月任务平均投入工时</view>
        <view class="work-bottom">
          <view class="bottom-left">上月：<span class="work-num">{{ state.staffTaskHour }}</span> <span
              class="work-unit">人天</span>
          </view>
          <view class="bottom-left">同比：<span class="work-num">{{ state.staffTaskHourDif < 0 ? -state.staffTaskHourDif :
            state.staffTaskHourDif }}</span>
                <span class="work-unit-black">人天</span> <span class="arrow-red"
                  v-if="state.staffTaskHourDif < 0"></span><span v-else class="arrow-green"></span></view>
        </view>
      </view>
      <view class="work-hour">
        <view class="work-title-top">员工上月完成任务平均数</view>
        <view class="work-bottom">
          <view class="bottom-left">上月：<span class="work-num">{{ state.staffTaskComplete }}</span> <span
              class="work-unit">个</span>
          </view>
          <view class="bottom-left">同比：<span class="work-num">{{ state.staffTaskCompleteDif < 0 ?
            -state.staffTaskCompleteDif : state.staffTaskCompleteDif }}</span>
                <span class="work-unit">个</span><span v-if="state.staffTaskCompleteDif < 0" class="arrow-red"></span><span
                  v-else class="arrow-green"></span>
          </view>
        </view>
      </view>

      <view class="bottom-content">
        <view class="work-plan">
          <view class="work-plan-title">
            <u-row gutter="10">
              <u-col span="6" class="work-plan-font"><span class="work-icon"></span> 工作计划</u-col>
            </u-row>
          </view>
          <u-calendar v-model="state.dateShow" mode="range" @change="handleConfirmDate" toolTip="日期选择"
            :min-date="state.minDate"> </u-calendar>
          <view class="record-date" @click="changeDate">
            <view class="date-left">
              <view class="start-time">{{ state.selectedDate[0] }}</view>
              <view class="time-icon"><svg t="1703746842977" class="time-icon" viewBox="0 0 1024 1024" version="1.1"
                  xmlns="http://www.w3.org/2000/svg" p-id="12210" id="mx_n_1703746842978" width="200" height="200">
                  <path
                    d="M830.1 636.6a2.77 2.77 0 0 0 0.9-0.1c0.4 0 0.7-0.1 1.1-0.1 0.2 0 0.5-0.1 0.7-0.1 0.4-0.1 0.8-0.1 1.1-0.2s0.4-0.1 0.6-0.1c0.4-0.1 0.8-0.2 1.1-0.3s0.4-0.1 0.6-0.1l1.1-0.3c0.2-0.1 0.4-0.1 0.6-0.2l1-0.3a1.85 1.85 0 0 1 0.7-0.2l0.9-0.3c0.3-0.1 0.5-0.2 0.8-0.3s0.5-0.2 0.8-0.3 0.6-0.3 0.9-0.4a4.88 4.88 0 0 1 0.7-0.3c0.3-0.2 0.6-0.3 0.9-0.5l0.6-0.3c0.3-0.2 0.7-0.4 1-0.6s0.3-0.2 0.5-0.3 0.7-0.4 1-0.6 0.3-0.2 0.5-0.3a5.5 5.5 0 0 0 0.9-0.7 2.18 2.18 0 0 0 0.5-0.4 2.7 2.7 0 0 0 0.8-0.7c0.2-0.2 0.5-0.4 0.7-0.6a2.65 2.65 0 0 1 0.6-0.5 29.49 29.49 0 0 0 2.5-2.5 2.65 2.65 0 0 0 0.5-0.6c0.2-0.2 0.4-0.5 0.6-0.7a2.7 2.7 0 0 1 0.7-0.8 2.18 2.18 0 0 1 0.4-0.5 5.5 5.5 0 0 1 0.7-0.9c0.1-0.2 0.2-0.3 0.3-0.5s0.4-0.7 0.6-1 0.2-0.3 0.3-0.5 0.4-0.7 0.6-1l0.3-0.6c0.2-0.3 0.3-0.6 0.5-0.9l0.3-0.6c0.1-0.3 0.3-0.6 0.4-0.9s0.2-0.5 0.3-0.8 0.2-0.5 0.3-0.8l0.3-0.9a1.85 1.85 0 0 0 0.2-0.7c0.1-0.3 0.2-0.7 0.3-1s0.1-0.4 0.2-0.6c0.1-0.4 0.2-0.7 0.3-1.1 0-0.2 0.1-0.4 0.1-0.6a5.16 5.16 0 0 0 0.2-1.1c0-0.2 0.1-0.4 0.1-0.6 0.1-0.4 0.1-0.8 0.2-1.1s0.1-0.5 0.1-0.7c0-0.4 0.1-0.7 0.1-1.1a2.77 2.77 0 0 1 0.1-0.9 2 2 0 0 1 0.1-0.8 21.64 21.64 0 0 0 0-3.6 2 2 0 0 0-0.1-0.8 2.77 2.77 0 0 0-0.1-0.9c0-0.4-0.1-0.7-0.1-1.1 0-0.2-0.1-0.5-0.1-0.7-0.1-0.4-0.1-0.8-0.2-1.1s-0.1-0.4-0.1-0.6a5.16 5.16 0 0 1-0.2-1.1c0-0.2-0.1-0.4-0.1-0.6-0.1-0.4-0.2-0.7-0.3-1.1-0.1-0.2-0.1-0.4-0.2-0.6s-0.2-0.7-0.3-1a1.85 1.85 0 0 1-0.2-0.7l-0.3-0.9c-0.1-0.3-0.2-0.5-0.3-0.8s-0.2-0.5-0.3-0.8-0.3-0.6-0.4-0.9l-0.3-0.6c-0.2-0.3-0.3-0.6-0.5-0.9l-0.3-0.6c-0.2-0.3-0.4-0.7-0.6-1s-0.2-0.3-0.3-0.5-0.4-0.7-0.6-1-0.2-0.3-0.3-0.5a5.5 5.5 0 0 0-0.7-0.9 2.18 2.18 0 0 0-0.4-0.5 2.7 2.7 0 0 0-0.7-0.8c-0.2-0.2-0.4-0.5-0.6-0.7l-0.6-0.6c-0.4-0.4-0.8-0.9-1.2-1.3L675.5 397.8a35.91 35.91 0 0 0-50.9 0 35.91 35.91 0 0 0 0 50.9l116 116H196.5a36 36 0 0 0-36 36 36 36 0 0 0 36 36h632.8c0.3 0 0.6-0.1 0.8-0.1z"
                    p-id="12211" fill="#bfbfbf"></path>
                </svg></view>
              <view class="end-time">{{ state.selectedDate[1] }} </view>
            </view>
            <view class="date-right"><u-icon name="calendar" size="32" color="rgba(0,0,0,0.25)"></u-icon></view>
          </view>
        </view>
        <!-- 底部项目详情 -->
        <view class="bottom-detail" v-for="(item, index) in state.projectData" :key="idnex">
<view class="inner">
  <view class="detail-title">
            <view class="detail-title-font"> {{ item.projectName }} </view>
          </view>
          <view class="detail-content">
            <u-row gutter="10">
              <u-col span="9">
                <span class="work-title">累计投入工时数：</span><span class="bottom-work-num">{{ item.workHour }}人天</span>
              </u-col>
              <u-col span="3" textAlign="right" style="display: flex; justify-content: end;">
                <view class="user-tag">
                  <span class="plname"></span><span class="user-name">{{ item.pmName }}</span>
                </view>
              </u-col>
            </u-row>
            <u-row gutter="10">
              <u-col>
                <span class="work-title">完成任务平均投入工时：</span><span class="bottom-work-num">{{ item.taskWorkHour }}人天</span>
              </u-col>
            </u-row>
            <u-row gutter="10">
              <u-col span="10">
                <span class="work-title">任务完成进度：</span><u-line-progress style="width: 50%;" :percent="item.completeRatio"
                  :show-percent="false" activeColor="#248BFF" height="13"></u-line-progress>
              </u-col>
              <u-col span="2" textAlign="right"><span class="progress-num">{{ item.completeRatio }}%</span></u-col>
            </u-row>
            <u-row gutter="10">
              <u-col></u-col>
            </u-row>
            <u-row gutter="10">
              <u-col></u-col>
            </u-row>
          </view>
</view>
        </view>
      </view>
    </view>
    <view class="main-right" v-else>
      <view class="user-search">
        <u-search placeholder="搜索部门名称或人员姓名" v-model="state.userSearch" shape="square" bg-color="#fff"
          :showAction="false"></u-search>
      </view>
      <view class="bgc-img"></view>
      <view class="user-list">
        <view class="user-item" v-for="(item, index) in  state.userList " :key="index"
          @click="handleCheckUser(item.objectBelongFlagEnum, item.id, item.name)">
          <view v-if="item.objectBelongFlagEnum === 'DEPARTMENT'" class="dep-avatar"></view>
          <view v-else class="user-avatar"></view>
          <view :class="item.objectBelongFlagEnum === 'DEPARTMENT' ? 'DEPARTMENT' : 'USER'">
            <view :class="item.objectBelongFlagEnum === 'DEPARTMENT' ? 'DEPARTMENT-NAME' : 'USER-NAME'">{{ item.name
            }}</view>
            <view v-if="item.objectBelongFlagEnum === 'USER'" class="dep-name">{{ item.departmentName }}</view>
          </view>
        </view>
      </view>
    </view>
    <!-- end vid_9hrpm9gcyt 自定义模板_2nlk3222kv -->
  </view>
</template>
<script setup>

import {
  ref, reactive, toRaw, markRaw,
  watch, computed,
  onBeforeMount, onMounted, onBeforeUnmount, onUnmounted, onActivated, onDeactivated, getCurrentInstance
} from "vue";
import { useRoute } from 'vue-router';
const route = useRoute();
import { get, post, put, del, request, requestWithHeaders } from '@/utils/http/Axios';
// import { cloneDeep, localGet, traversalTreeStructure, set, checkCaseCondition, throttle, merge, debounce, getGridStyle, getCellRenderAble, formulaStrategy, getApplicationId } from '@/utils/index';
import { isEqual, isNullOrEmpty, isEmptyArr, isArray, isEmpty, isNullOrUnDef, isContained } from '@/utils/is';
import { CovertOptions, getChartsDataSourceConvert } from '@/utils/chart';
import { propertyFormatByNumber, propertyFormatByPercentage, propertyFormatByDate } from '@/utils/format';
import { FormFormat } from '@/utils/formFormat'
import { customAddWaterMarkFunc, generateWaterMarkText } from '@/utils/addWaterMark';
import dayjs from 'dayjs';
import hashSum from 'hash-sum';
/*** UNI_APP_EXEGESIS ***
import { handleRedirect, permission, parseJson } from '@/utils/common';
import { onPullDownRefresh, onLoad, onReady, onShow, onHide, onPageScroll, onUnload } from '@dcloudio/uni-app';
import { BroadcastMessage } from '@/utils/BroadcastMessage';
import { sendToken } from "@/hooks/useIframeToken";
*** UNI_APP_EXEGESIS ***/


// ---------------------------- 属性定义 ----------------------------
const sourceId = "page3000000100"
import { handleRedirect, permission, parseJson } from '@/utils/common';
// 是否显示菜单按钮
const isMenuIconShow = false;
// NAVIGATION_MENU
const handleShowNavigation = () => { };

let isProcessState = ref(false);


const setTimeOutList = [];


const vid_9hrpm9gcyt_props = reactive({
  code: "<view class=\"custom-tabs\">\n      <view class=\"custom-tab\" :class=\"{ active: state.current === 0 }\" @click=\"tabChange(0)\">\n        {{ tabList[0].name }}\n        <span v-if=\"state.current === 0\" class=\"custom-tab-underline\"></span>\n\n      </view>\n      <view class=\"border-middle\"></view>\n      <view class=\"custom-tab\" :class=\"{ active: state.current === 1 }\" @click=\"tabChange(1)\">\n        {{ tabList[1].name }}\n        <span v-if=\"state.current === 1\" class=\"custom-tab-underline\"></span>\n      </view>\n    </view>\n    <view class=\"main-left\" v-if=\"state.tabFlag\">\n      <view class=\"bgc-img\"></view>\n      <view class=\"work-hour\">\n        <view class=\"work-title-top\">员工上月投入工时</view>\n        <view class=\"work-bottom\">\n          <view class=\"bottom-left\">上月：<span class=\"work-num\">{{ state.staffHour }}</span> <span\n              class=\"work-unit\">人天</span> </view>\n          <view class=\"bottom-left\">同比：<span class=\"work-num\">{{ state.staffHourDif < 0 ? -state.staffHourDif :\n            state.staffHourDif }}</span> <span class=\"work-unit-black\">人天</span> <span class=\"arrow-red\"\n                  v-if=\"state.staffHourDif < 0\"></span><span v-else class=\"arrow-green\"></span></view>\n        </view>\n      </view>\n      <view class=\"work-hour\">\n        <view class=\"work-title-top\">员工上月任务平均投入工时</view>\n        <view class=\"work-bottom\">\n          <view class=\"bottom-left\">上月：<span class=\"work-num\">{{ state.staffTaskHour }}</span> <span\n              class=\"work-unit\">人天</span> </view>\n          <view class=\"bottom-left\">同比：<span class=\"work-num\">{{ state.staffTaskHourDif < 0 ? -state.staffTaskHourDif :\n            state.staffTaskHourDif }}</span> <span class=\"work-unit-black\">人天</span> <span class=\"arrow-red\"\n                  v-if=\"state.staffTaskHourDif < 0\"></span><span v-else class=\"arrow-green\"></span></view>\n        </view>\n      </view>\n      <view class=\"work-hour\">\n        <view class=\"work-title-top\">员工上月完成任务平均数</view>\n        <view class=\"work-bottom\">\n          <view class=\"bottom-left\">上月：<span class=\"work-num\">{{ state.staffTaskComplete }}</span> <span\n              class=\"work-unit\">个</span> </view>\n          <view class=\"bottom-left\">同比：<span class=\"work-num\">{{ state.staffTaskCompleteDif < 0 ?\n            -state.staffTaskCompleteDif : state.staffTaskCompleteDif }}</span> <span class=\"work-unit\">个</span><span\n                  v-if=\"state.staffTaskCompleteDif < 0\" class=\"arrow-red\"></span><span v-else class=\"arrow-green\"></span>\n          </view>\n        </view>\n      </view>\n\n      <view class=\"bottom-content\">\n        <view class=\"work-plan\">\n          <view class=\"work-plan-title\">\n            <u-row gutter=\"10\">\n              <u-col span=\"6\" class=\"work-plan-font\"><span class=\"work-icon\"></span> 工作计划</u-col>\n            </u-row>\n          </view>\n          <u-calendar v-model=\"state.dateShow\" mode=\"range\" @change=\"handleConfirmDate\" toolTip=\"日期选择\"\n            :min-date='state.minDate'>\n\n          </u-calendar>\n          <view class=\"record-date\" @click=\"changeDate\">\n            <view class=\"date-left\">\n              <view class=\"start-time\">{{ state.selectedDate[0] }}</view>\n              <view class=\"time-icon\"><svg t=\"1703746842977\" class=\"time-icon\" viewBox=\"0 0 1024 1024\" version=\"1.1\"\n                  xmlns=\"http://www.w3.org/2000/svg\" p-id=\"12210\" id=\"mx_n_1703746842978\" width=\"200\" height=\"200\">\n                  <path\n                    d=\"M830.1 636.6a2.77 2.77 0 0 0 0.9-0.1c0.4 0 0.7-0.1 1.1-0.1 0.2 0 0.5-0.1 0.7-0.1 0.4-0.1 0.8-0.1 1.1-0.2s0.4-0.1 0.6-0.1c0.4-0.1 0.8-0.2 1.1-0.3s0.4-0.1 0.6-0.1l1.1-0.3c0.2-0.1 0.4-0.1 0.6-0.2l1-0.3a1.85 1.85 0 0 1 0.7-0.2l0.9-0.3c0.3-0.1 0.5-0.2 0.8-0.3s0.5-0.2 0.8-0.3 0.6-0.3 0.9-0.4a4.88 4.88 0 0 1 0.7-0.3c0.3-0.2 0.6-0.3 0.9-0.5l0.6-0.3c0.3-0.2 0.7-0.4 1-0.6s0.3-0.2 0.5-0.3 0.7-0.4 1-0.6 0.3-0.2 0.5-0.3a5.5 5.5 0 0 0 0.9-0.7 2.18 2.18 0 0 0 0.5-0.4 2.7 2.7 0 0 0 0.8-0.7c0.2-0.2 0.5-0.4 0.7-0.6a2.65 2.65 0 0 1 0.6-0.5 29.49 29.49 0 0 0 2.5-2.5 2.65 2.65 0 0 0 0.5-0.6c0.2-0.2 0.4-0.5 0.6-0.7a2.7 2.7 0 0 1 0.7-0.8 2.18 2.18 0 0 1 0.4-0.5 5.5 5.5 0 0 1 0.7-0.9c0.1-0.2 0.2-0.3 0.3-0.5s0.4-0.7 0.6-1 0.2-0.3 0.3-0.5 0.4-0.7 0.6-1l0.3-0.6c0.2-0.3 0.3-0.6 0.5-0.9l0.3-0.6c0.1-0.3 0.3-0.6 0.4-0.9s0.2-0.5 0.3-0.8 0.2-0.5 0.3-0.8l0.3-0.9a1.85 1.85 0 0 0 0.2-0.7c0.1-0.3 0.2-0.7 0.3-1s0.1-0.4 0.2-0.6c0.1-0.4 0.2-0.7 0.3-1.1 0-0.2 0.1-0.4 0.1-0.6a5.16 5.16 0 0 0 0.2-1.1c0-0.2 0.1-0.4 0.1-0.6 0.1-0.4 0.1-0.8 0.2-1.1s0.1-0.5 0.1-0.7c0-0.4 0.1-0.7 0.1-1.1a2.77 2.77 0 0 1 0.1-0.9 2 2 0 0 1 0.1-0.8 21.64 21.64 0 0 0 0-3.6 2 2 0 0 0-0.1-0.8 2.77 2.77 0 0 0-0.1-0.9c0-0.4-0.1-0.7-0.1-1.1 0-0.2-0.1-0.5-0.1-0.7-0.1-0.4-0.1-0.8-0.2-1.1s-0.1-0.4-0.1-0.6a5.16 5.16 0 0 1-0.2-1.1c0-0.2-0.1-0.4-0.1-0.6-0.1-0.4-0.2-0.7-0.3-1.1-0.1-0.2-0.1-0.4-0.2-0.6s-0.2-0.7-0.3-1a1.85 1.85 0 0 1-0.2-0.7l-0.3-0.9c-0.1-0.3-0.2-0.5-0.3-0.8s-0.2-0.5-0.3-0.8-0.3-0.6-0.4-0.9l-0.3-0.6c-0.2-0.3-0.3-0.6-0.5-0.9l-0.3-0.6c-0.2-0.3-0.4-0.7-0.6-1s-0.2-0.3-0.3-0.5-0.4-0.7-0.6-1-0.2-0.3-0.3-0.5a5.5 5.5 0 0 0-0.7-0.9 2.18 2.18 0 0 0-0.4-0.5 2.7 2.7 0 0 0-0.7-0.8c-0.2-0.2-0.4-0.5-0.6-0.7l-0.6-0.6c-0.4-0.4-0.8-0.9-1.2-1.3L675.5 397.8a35.91 35.91 0 0 0-50.9 0 35.91 35.91 0 0 0 0 50.9l116 116H196.5a36 36 0 0 0-36 36 36 36 0 0 0 36 36h632.8c0.3 0 0.6-0.1 0.8-0.1z\"\n                    p-id=\"12211\" fill=\"#bfbfbf\"></path>\n                </svg></view>\n              <view class=\"end-time\">{{ state.selectedDate[1] }} </view>\n            </view>\n            <view class=\"date-right\"><u-icon name=\"calendar\" size=\"32\" color=\"rgba(0,0,0,0.25)\"></u-icon></view>\n          </view>\n        </view>\n        <!-- 底部项目详情 -->\n        <view class=\"bottom-detail\" v-for=\"(item, index) in state.projectData\" :key=\"idnex\">\n          <view class=\"detail-title\">\n            <view class=\"detail-title-font\"> {{ item.projectName }} </view>\n          </view>\n          <view class=\"detail-content\">\n            <u-row gutter=\"10\">\n              <u-col span=\"9\">\n                <span class=\"work-title\">累计投入工时数：</span><span class=\"bottom-work-num\">{{ item.workHour }}人天</span>\n              </u-col>\n              <u-col span=\"3\" textAlign=\"right\" style=\"display: flex; justify-content: end;\">\n                <view class=\"user-tag\"> <span class=\"plname\"></span><span class=\"user-name\">{{ item.pmName }}</span>\n                </view>\n\n              </u-col>\n            </u-row>\n            <u-row gutter=\"10\">\n              <u-col>\n                <span class=\"work-title\">完成任务平均投入工时：</span><span class=\"bottom-work-num\">{{ item.taskWorkHour }}人天</span>\n              </u-col>\n            </u-row>\n            <u-row gutter=\"10\">\n              <u-col span=\"10\">\n                <span class=\"work-title\">任务完成进度：</span><u-line-progress style=\"width: 50%;\" :percent=\"item.completeRatio\"\n                  :show-percent=\"false\" activeColor=\"#248BFF\" height=\"13\"></u-line-progress>\n              </u-col>\n              <u-col span=\"2\" textAlign=\"right\"><span class=\"progress-num\">{{ item.completeRatio }}%</span></u-col>\n            </u-row>\n            <u-row gutter=\"10\">\n              <u-col></u-col>\n            </u-row>\n            <u-row gutter=\"10\">\n              <u-col></u-col>\n            </u-row>\n          </view>\n        </view>\n      </view>\n    </view>\n    <view class=\"main-right\" v-else>\n      <view class=\"user-search\">\n        <u-search placeholder=\"搜索部门名称或人员姓名\" v-model=\"state.userSearch\" shape=\"square\" bg-color='#fff'\n          :showAction=\"false\"></u-search>\n      </view>\n      <view class=\"bgc-img\"></view>\n      <view class=\"user-list\">\n        <view class=\"user-item\" v-for=\"(item, index) in  state.userList \" :key=\"index\"\n          @click=\"handleCheckUser(item.objectBelongFlagEnum, item.id, item.name)\">\n          <view v-if=\"item.objectBelongFlagEnum === 'DEPARTMENT'\" class=\"dep-avatar\"></view>\n          <view v-else class=\"user-avatar\"></view>\n          <view :class=\"item.objectBelongFlagEnum === 'DEPARTMENT' ? 'DEPARTMENT' : 'USER'\">\n            <view :class=\"item.objectBelongFlagEnum === 'DEPARTMENT' ? 'DEPARTMENT-NAME' : 'USER-NAME'\">{{ item.name\n            }}</view>\n            <view v-if=\"item.objectBelongFlagEnum === 'USER'\" class=\"dep-name\">{{ item.departmentName }}</view>\n          </view>\n        </view>\n      </view>\n    </view>",
});



// ============================ 属性定义 ============================

// ---------------------------- 元素数据引用 ----------------------------
// 组件 自定义模板_2nlk3222kv ref 的引用
const vid_9hrpm9gcyt_ref = ref(null);
// 动态key的map
const fieldTypeMap = {};
// 动态key的map
const refMap = { vid_9hrpm9gcyt_ref };

const showState = reactive({
  vid_9hrpm9gcyt_visible: true,
})
// ============================ 元素数据引用 ============================

// ---------------------------- 数据 ----------------------------


// ============================ 数据 ============================

// ---------------------------- 方法 ----------------------------
// ---------------------------- 页面数据 ----------------------------


// ============================ 页面数据 ============================

// ---------------------------- 响应 ----------------------------

// ============================ 响应 ============================

// ---------------------------- 函数 ----------------------------

// 自定义函数 返回上一页
const customFunction_goBack_tt9by2ki2g = (...params) => {
  uni.navigateBack()
}

// ============================ 函数 ============================

// ---------------------------- 页面参数 ----------------------------

const pageParameter_state = reactive({
  'processInstanceId': undefined,
})

// ============================ 页面参数 ============================

// ---------------------------- 组件事件处理方法 ----------------------------


// ============================ 组件事件处理方法 ============================

// ============================ 方法 ============================

// ---------------------------- 生命周期 ----------------------------
/*** UNI_APP_EXEGESIS ***
    // 获取上一层传递的数据
    const workflowChannel = new BroadcastMessage('WORKFLOW');
    workflowChannel.publish({ status: 'Ready' });
    workflowChannel.subscribe((data) => {
      if (data) {
        isProcessState.value = (window.self !== window.parent && data.type === 'hideHeader');
      }
    });
    *** UNI_APP_EXEGESIS ***/


const pageScrollTop = ref(0)

// *** PREVIEW_EXEGESIS ***
onMounted(() => {
  setPageParams(route.query)
  // 设置表单的rule
  try {

  } catch {
    // do nothing
  }
});
// *** PREVIEW_EXEGESIS *** //

/*** UNI_APP_EXEGESIS ***
const routeOption = ref({})
onLoad((option) => {
  routeOption.value = option;
});
onReady(() => {
  setPageParams(routeOption.value)
  // 设置表单的rule
  try{

  }catch{
      // do nothing
  }
});
// 图表刷新标记
const uChartsReshowFlag = ref(false);
onHide(() => { // 页面隐藏后标记置为false(如果不置为false无法触发图表更新)
    uChartsReshowFlag.value = false
})
onShow(() => {
    uChartsReshowFlag.value = true; // 页面激活后,标记置为true

    setPageParams(routeOption.value)
})
onPageScroll(e => {
    pageScrollTop.value = e.scrollTop
});
*** UNI_APP_EXEGESIS ***/

const setPageParams = (routerParam) => {
  const pageParams = [{ "dataType": "STRING", "dependencies": [], "name": "processInstanceId" }];
  const strategyMap = {
    STRING: (param, paramValue) => {
      pageParameter_state[param.name] = paramValue;
    },
    BOOLEAN: (param, paramValue) => {
      if ('true' === (paramValue || '').toLowerCase()) {
        pageParameter_state[param.name] = true
      } else if ('false' === (paramValue || '').toLowerCase()) {
        pageParameter_state[param.name] = false
      } else {
        // TODO: 是否要支持toast
        console.error('参数传入错误！类型不匹配！');
      }
    },
    NUMBER: (param, paramValue) => {
      if (!isNaN(paramValue)) {
        pageParameter_state[param.name] = Number(paramValue);
      } else {
        // TODO: 是否要支持toast
        console.error('参数传入错误！类型不匹配！');
      }
    },
    ARRAY: (param, paramValue) => {
      if (isNullOrUnDef(paramValue) || !paramValue || paramValue === 'undefined') { // default value
        pageParameter_state[param.name] = [];
      } else if (paramValue.trim().startsWith('[') && paramValue.trim().endsWith(']')) {
        try {
          pageParameter_state[param.name] = JSON.parse(decodeURI(paramValue));
        } catch (error) {
          console.error('参数解析失败 ', error);
        }
      } else {
        console.error('参数传入错误！类型不匹配！');
      }
    },
  };
  pageParams.forEach((param) => {
    strategyMap[param.dataType](param, routerParam[param.name])
  });


}

onUnmounted(() => {
  // 销毁定时器
  setTimeOutList.forEach(({ repeat, timer }) => {
    repeat ? clearInterval(timer) : clearTimeout(timer);
  });
});


/*** UNI_APP_EXEGESIS ***
onPullDownRefresh(() => {
  // 下拉刷新
  setTimeout(() => {
      uni.stopPullDownRefresh()
  }, 1000)
})
*** UNI_APP_EXEGESIS ***/

// ============================ 生命周期 ============================

// ---------------------------- 数据关联处理 ----------------------------
// ---------------------------- 组件数据同步 ----------------------------

// ============================ 组件数据同步 ============================
//
// ============================ 数据关联处理 ============================

// ---------------------- 不同组件自定义的处理逻辑 ---------------------

// ====================== 不同组件自定义的处理逻辑 ======================


// ================================定制化逻辑========================================
onMounted(() => {
  let a = document.querySelector('.uni-page-head')
  if (a) a.remove()
  let appDiv = document.querySelector('#app')
  console.log(appDiv, 'adsdas');
  appDiv.style.background = 'linear-gradient(180deg, #E1EFFD 100%, #ffffff 0%)';


  // 获取当前日期
  const today = dayjs();

  // 获取本月第一天
  const firstDayOfMonth = today.startOf('month');

  // 格式化日期为 YYYY-MM-DD
  state.selectedDate[0] = firstDayOfMonth.format('YYYY-MM-DD');
  state.selectedDate[1] = today.format('YYYY-MM-DD');
  getProjectDate()
  getBottomData()
  getUserList()
})
function getProjectDate() {
  post('/solution-ppm/api/v2/built-in-system-ppm/dashboard/human-efficiency-analysis/chart').then(({ data }) => {
    state.staffHour = data.staffHour
    state.staffHourDif = data.staffHourDif
    state.staffTaskHour = data.staffTaskHour
    state.staffTaskHourDif = data.staffTaskHourDif
    state.staffTaskComplete = data.staffTaskComplete
    state.staffTaskCompleteDif = data.staffTaskCompleteDif
  })

}
function getBottomData() {
  const params = {
    startTime: state.selectedDate[0],
    endTime: state.selectedDate[1]
  }
  post('/solution-ppm/api/v2/built-in-system-ppm/dashboard/human-efficiency-analysis/work-plan', params).then(({ data }) => {
    state.projectData = data.humanEfAnWorkPlanDetailDtoList
  })
}

const depIcon = 'http://10.40.0.33:9001/file-storage/416558852345673728.png'
const userIcon = 'http://10.40.0.33:9001/file-storage/416679569361975296.png'
const state = reactive({
  tabFlag: true,
  selectedDate: [],
  current: 0,
  userSearch: '',
  userList: [],
  staffHour: '',
  staffHourDif: '',
  staffTaskHour: '',
  staffTaskHourDif: '',
  staffTaskComplete: '',
  staffTaskCompleteDif: '',
  projectData: [],
  minDate: ''
})
function changeDate() {
  state.dateShow = true
}
function debounceFun(fn, wait = 300) {
  var timer = null;
  return function () {
    if (timer !== null) {
      clearTimeout(timer);
    }
    timer = setTimeout(() => fn.apply(this, arguments), wait);
  }
}
const newGetUser = debounceFun(getUserList, 1000)
watch(() => state.userSearch, () => {
  newGetUser()
}, { deep: true })
function handleConfirmDate(params) {
  state.selectedDate[0] = params.startDate
  state.selectedDate[1] = params.endDate
  getBottomData()
}
const tabList = [
  {
    name: '图表分析',
  },
  {
    name: '员工列表',
  },
];
function tabChange(index) {
  console.log(index, 'asdasdsad');
  state.current = index;
  if (index === 0) {
    state.tabFlag = true;
  } else {
    state.tabFlag = false;
  }
}
function getUserList() {
  const params = {
    name: state.userSearch
  }
  post('/solution-ppm/api/v2/built-in-system-ppm/dashboard/human-efficiency-analysis/employee_list', params).then(({ data }) => {
    state.userList = data
  })
}
function handleCheckUser(objectBelongFlagEnum, id, name) {
  if (objectBelongFlagEnum === 'DEPARTMENT') {
    handleRedirect(`/pages/Page3000000101/Page3000000101?id=${id}`)
  } else {
    handleRedirect(`/pages/Page3000000242/Page3000000242?name=${name}`)
  }
}
function getSixMonthsAgoDate() {
  // 获取当前日期
  let currentDate = new Date();

  // 获取当前月份
  let currentMonth = currentDate.getMonth() + 1; // 注意：月份是从 0 开始的，所以要加 1

  // 获取当前年份
  let currentYear = currentDate.getFullYear();

  // 计算6个月前的年份和月份
  let sixMonthsAgoYear = currentYear;
  let sixMonthsAgoMonth = currentMonth - 6;

  // 处理跨年的情况
  if (sixMonthsAgoMonth <= 0) {
    sixMonthsAgoYear--;
    sixMonthsAgoMonth += 12;
  }

  // 设置日期为月初的第一天
  let sixMonthsAgoDate = new Date(sixMonthsAgoYear, sixMonthsAgoMonth - 1, 1);

  // 格式化日期为 YYYY-MM-DD
  let formattedDate = sixMonthsAgoDate.toISOString().slice(0, 10);

  return formattedDate;
}
// 调用函数获取6个月前的日期
let sixMonthsAgo = getSixMonthsAgoDate();
state.minDate = sixMonthsAgo
</script>
<style lang="less" scoped>
.page_root {
  min-height: 100%;
  box-sizing: border-box;
}


.page_root {
  min-height: 100%;
  box-sizing: border-box;
  background-color: #3575C7;
  overflow: hidden !important;
}

.custom-tabs {
  background-color: #3673C9;
  display: flex;
  position: relative;
}

.custom-tab {
  flex: 1;
  text-align: center;
  cursor: pointer;
  padding: 10px;
  background-color: transparent;
  position: relative;
  color: #ffffff;
  font-size: 16px;
  transition: border-color 0.6s;
  text-align: center;
}

.border-middle {
  width: 1px;
  height: 23px;
  position: absolute;
  border: 1px solid #729FD8;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.custom-tab.active {
  background-color: transparent;

  font-size: 16px;
  color: #FFFFFF;
  letter-spacing: 0;
  text-align: center;
  font-weight: 600;
}

.main-left {
  height: calc(100vh - 88px);
  background: linear-gradient(180deg, #E1EFFD 100%, #ffffff 0%);

  padding: 15px;
  border-top-left-radius: 16px;
  border-top-right-radius: 16px;
  position: relative;
  overflow: auto;
}

.bgc-img {
  position: absolute;
  width: 100%;
  height: 300px;
  left: 0;
  top: -180px;
  background-image: url('http://10.40.0.33:9001/file-storage/416680575854426112.png');
  background-size: cover;
}

.main-right {
  height: calc(100vh - 90px);
  background: linear-gradient(180deg, #E1EFFD 100%, #ffffff 0%);
  padding: 15px;
  border-top-left-radius: 16px;
  border-top-right-radius: 16px;
  position: relative;
  overflow: hidden;
}

.work-hour {
  position: relative;
  height: 80px;
  background-color: #fff;
  margin-bottom: 15px;
  border-radius: 10px;
  padding: 15px;
  z-index: 2;
}

.work-title {

  font-size: 14px;
  color: #595959;
  letter-spacing: 0;
  font-weight: 400;
}

.work-title-top {

  font-size: 14px;
  color: #262626;
  font-weight: 600;
}

.work-bottom {
  display: flex;
  justify-content: space-between;
}

.work-num {
  font-size: 20px;
  color: #008BFF;
  font-weight: 600;
}

.work-unit {
  font-size: 14px;
  color: #008BFF;
}

.bottom-left {
  font-size: 14px;
  color: #595959;
  white-space: nowrap;
  overflow-x: auto;
}


.budget-title {
  height: 80px;
  height: 80px;
  background-image: linear-gradient(270deg, rgba(0, 121, 255, 0.00) 0%, #0079FF 100%);
  border-radius: 6px;
  padding: 8px 15px;
  display: flex;
  background-size: cover;
}

.budget-title-font {
  font-size: 16px;
  color: #fff;
  margin-left: 8px;
}


.budget-content {
  height: 103px;
  width: 100%;
  border: 1px solid #fff;
  position: relative;
  top: -40px;
  background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.80) 0%, rgba(255, 255, 255, 0.90) 50%, rgba(255, 255, 255, 0.80) 100%);
  border: 1.5px solid #FFFFFF;
  box-shadow: 0 4px 10px 0 #CFE7FF;
  border-radius: 6px;
  backdrop-filter: blur(5px);
  border: 1px solid #fff;
  padding: 15px;
}

.user-search {
  width: 100%;
  padding: 15px;
  position: absolute;
  border-top-left-radius: 16px;
  border-top-right-radius: 16px;
  left: 0px;
  top: 0;
  height: 65px;
  border-top: 1px solid #fff;
  z-index: 2;
}

.user-list {
  padding: 10px 15px 15px 15px;
  height: calc(100vh - 170px);
  background-color: rgba(255, 255, 255, 0.80);
  position: absolute;
  top: 65px;
  left: 0;
  width: 100%;
  overflow: auto;
}

.work-plan {
  height: 86px;
}

.work-plan-font {
  padding-left: 15px;
  line-height: 25px;
  font-size: 16px;
  color: #262626;
  font-weight: 600;
}

.record-date {
  display: flex;
  height: 32px;
  background: #FFFFFF;
  border: 1px solid #D9D9D9;
  border-radius: 4px;
  margin: 14px 0;
  font-family: PingFangSC-Regular;
  font-size: 14px;
  color: #262626;
  line-height: 32px;
  font-weight: 400;
  padding: 0 15px 0 15px;
  line-height: 40px;
}


.date-left {
  display: flex;
  justify-content: space-between;
}

.date-left {
  width: 70%;
  font-size: 14px;
}

.date-right {
  flex: 1;
  text-align: right;
  line-height: 30px;
}

.time-icon {
  height: 16px;
  width: 16px;
}

.work-icon {
  margin-right: 3px;
  position: relative;
  top: 2px;
  display: inline-block;
  width: 16px;
  height: 16px;
  background-image: url('http://10.40.0.33:9001/file-storage/416539371340806144.png');
  background-size: cover;
}

.bottom-content {
  position: absolute;
  height: calc(100vh - 400px);
  background: #FFFFFF;
  border-radius: 12px 12px;
  width: 100%;
  left: 0;
  padding: 15px;
  overflow: auto;
}

.detail-title {
  height: 40px;
  background-image: linear-gradient(90deg, #CDE8FD 0%, rgba(205, 232, 253, 0.00) 100%);

  padding: 8px 15px;
  display: flex;
}

.detail-title-font {

  font-size: 16px;
  color: #262626;
  letter-spacing: 0;
  font-weight: 600;
}


.detail-content {
  height: 105px;
  width: 100%;

  margin-bottom: 15px;

  padding: 12px 15px;
  line-height: 1.8;
}

.user-tag {
  background-image: linear-gradient(270deg, rgba(205, 232, 253, 0.00) 0%, #CDE8FD 100%);
  border-radius: 10px;
  height: 20px;
  min-width: 60px;
  padding: 0 0 0 10px;
  line-height: 20px;
}

.user-icon {
  width: 16px;
  height: 18px;
}

.plname {
  width: 14px;
  height: 14px;
  display: inline-block;
  background-image: url('http://10.40.0.33:9001/file-storage/416682682311489536.png');
  background-size: cover;
}

.user-name {
  padding-right: 3px;
  position: relative;
  top: -2px;
  display: inline-block;
  height: 20px;
  line-height: 20px;

  font-size: 12px;
  color: #595959;
  letter-spacing: 0;
  font-weight: 600;
}

.date-time-picker {

  font-size: 12px;
  color: #595959;
  letter-spacing: 0;
  font-weight: 400;
}

.bottom-work-num {

  font-size: 14px;
  color: #262626;
  letter-spacing: 0;
  font-weight: 600;
}

:global(.u-active) {
  border-radius: inherit
}

.user-item {
  position: relative;
  height: 50px;
  border-bottom: 1px solid rgba(217, 217, 217, 1);
}

.DEPARTMENT {
  line-height: 50px;

}

.arrow-red {
  display: inline-block;
  width: 8px;
  height: 12px;
  margin-left: 20px;
  background-image: url('http://10.40.0.33:9001/file-storage/416687750024771584.png');
  background-size: cover;
}

.arrow-green {
  display: inline-block;
  width: 8px;
  height: 12px;
  margin-left: 20px;
  background-image: url('http://10.40.0.33:9001/file-storage/416687779869341696.png');
  background-size: cover;
}

.DEPARTMENT-NAME {

  font-size: 16px;
  color: #262626;
  letter-spacing: 0;
  font-weight: 400;
  margin-left: 50px;
}

.USER {
  display: flex;
  flex-direction: column;
}

.USER-NAME {
  height: 60%;

  font-size: 16px;
  color: #262626;
  letter-spacing: 0;
  font-weight: 500;
  margin-left: 50px;
}

.dep-name {
  flex: 1;

  font-size: 12px;
  color: #595959;
  letter-spacing: 0;
  font-weight: 400;
  margin-left: 50px;
}

.dep-avatar {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translate(-0, -50%);
  border: 1px solid #FFFFFF;
  border-radius: 6px;
  width: 40px;
  height: 40px;
  background-image: url('http://10.40.0.33:9001/file-storage/416558852345673728.png');
  background-size: cover;
}

.user-avatar {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translate(-0, -50%);
  border: 1px solid #FFFFFF;
  border-radius: 6px;
  width: 40px;
  height: 40px;
  background-image: url('http://10.40.0.33:9001/file-storage/416743848096282624.png');
  background-size: cover;
}

.work-unit-black {

  font-size: 12px;
  color: #595959;
  letter-spacing: 0;
  font-weight: 400;
}

.progress-num {

  font-size: 14px;
  color: #262626;
  letter-spacing: 0;
  font-weight: 600;
}

.start-time,
.end-time {
  line-height: 30px;

}
.bottom-detail{
  border-radius: 3px;
  box-shadow: 0 0 10px 0 #CFE7FF;
  overflow: hidden;
}
.inner{
  border: 2px solid;
  border-image: linear-gradient(360deg, rgba(41, 129, 223, 0) 0%, rgba(41, 129, 223, 1) 100%) 3 3 3 3;
  height: 100%;
}
</style>
